import Vue from 'vue'
import Router from 'vue-router'
// import HelloWorld from '@/components/HelloWorld'
// import Progress from '@/views/progress'
// import Index from '@/views/index'
// import Goods from '@/views/goods'
// import NotFound from '@/common/notFound/notFound'
// 不同的路由进行对应的页面的代码，异步路由，异步页面,就是匹配到哪个路由，就直接import哪个页面,
// babel-plugin-syntax-dynamic-import 实现的按需加载
// update不知道怎么用
Vue.use(Router)

export default new Router({
  mode: 'history',
  // scrollBehavior(to,from,savedPosition), // 路由跳转是否要滚动页面，自定义页面滚动页面
  // 一般时这么做的，滚动页面到原来的页面，没有滚动，就直接在顶部
  // if(savedPosition) {
  //       return savedPosition
  //   }else{
  //     return (x:0,y:0)
  //   },
  // fallback:true, 浏览器不支持，可以设置自动转化成false，一般设置为true
  // base:'/base/ , // 在所有路由之前加上/base/,z作用区分开主路由和其他路由
  // linkActiveClass:'active-link',  // 全局链接样式
  // linkExactActiveClass:'exact-active-link // 完全一摸一样的里面，子集的问题
  routes: [{
      path: '/',
      component: () => import('@/views/signatureDrag')
      //   component: Index
      //   components: {
      //     default: Index,
      //     a: Progress
      //   }
    },
    {
      path: '/index/:id',
      //   props:true,  // 可以直接傳過去：id直接傳過去
      props: (route) => ({
        id: route.query.b,
        title: route.query.a
      }),
      name: 'Index',
      component: () => import('@/views/index'),
      //   方法二：在before each 之后
      beforeEnter (to, from, next) {
        console.log('app route before enter')
        next()
      },
      children: [{
        path: 'goods/:gid',
        name: 'goods',
        component: () => import('@/views/goods')
      }]
    }, {
      path: '/Progress/:pid',
      props: true,
      name: 'Progress',
      component: () => import('@/views/progress')
      //   components: {
      //     default: Progress,
      //     a: Index
      //   }
    },
    {
      path: '/jsTest',
      name: 'jsTest',
      component: () => import('@/views/jsTest/jsTest'),
      meta: {
        title: 'this is app',
        description: 'js新方法了解'
      }
    },
    {
      path: '/Progress/exact',
      name: 'Progress2',
      component: () => import('@/views/progress'),
      meta: {
        title: 'this is app',
        description: '内容展示'
      }
    },
    {
      path: '/login',
      name: 'login',
      component: () => import('@/views/login'),
      meta: {
        title: 'this is 登录页',
        description: '登录页面'
      }
    },
    {
        path: '/talk',
        name: 'talk',
        component: () => import('@/views/talk'),
        meta: {
          title: 'WebSocket',
          description: '对话'
        }
      },
    {
      path: '/home',
      name: 'home',
      component: () => import('@/views/home'),
      meta: {
        title: 'veu-router--面包屑',
        description: '结合面包屑导航'
      },
      children: [{
          path: 'mine',
          name: 'Mine',
          meta: {
            breadNumber: '我的'
          },
          component: () => import('@/views/childViews/mine')
        },
        {
          path: 'order/:id',
          name: 'Order',
          meta: {
            breadNumber: '订单'
          },
          component: () => import('@/views/childViews/order')
        }
      ]
    },
    {
      path: '/module',
      name: 'module', // 可以通过name跳转
      component: () => import('@/views/modules/modules')
    },
    {
      path: '*',
      name: 'notFound', // 可以通过name跳转
      component: () => import('@/common/notFound/notFound')
    }
  ]
})
